<?xml version='1.0' encoding='UTF-8' ?> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html">

    <h:head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <h:outputStylesheet library="css" name="style.css"/>
        <h:outputStylesheet library="css" name="style2.css"/>
        <h:outputStylesheet library="css" name="skitter.styles.css" />
        <h:outputScript name="jquery-1.8.1.min.js" library="js" />
        <h:outputScript name="jquery.easing.1.3.js" library="js" />
        <h:outputScript name="jquery.animate-colors-min.js" library="js" />
        <h:outputScript name="jquery.skitter.min.js" library="js" />




        <script type="text/javascript" language="javascript">
            $(document).ready(function() {
                $('.box_skitter_large').skitter({
                    theme: 'clean',
                    numbers_align: 'center',
                    progressbar: true, 
                    dots: true, 
                    preview: true
                });
            });
        </script>

        <title>inicio</title>
    </h:head>

    <h:body>
        <div id="wrap" >
            <h:form id="fmenu">

                <div class="header">
                    

                    <div class="logo"><h:commandLink action="#{homeController.index}"><h:graphicImage library="images"
                                                                                                      name="logo.png"   style="border: 0px" /></h:commandLink>
                    </div>            
                    <div id="menu">

                        <ul>                                                                       
                            <li class="selected"><h:commandLink value="inicio" action="#{homeController.index}"/></li>
                            <li><h:commandLink value="acerca de" action="#{homeController.acercaDe}"/></li>

                            <li><h:commandLink value="catalogo" action="#{homeController.miCuenta}"/></li>

                            <li><h:commandLink value="contacto" action="#{homeController.contacto}"/></li>
                            <li><h:commandLink value="admistracion" action="#{homeController.adminIndex}"/></li>
                        </ul>
                    </div>
                </div>




            </h:form>
            <!--comienzo del contenido derecho-->
            <div class="center_content">

                <div class="left_content">
                    <ui:insert name="contenido_izq" >

                        <div class="title"><span class="title_icon"><h:graphicImage library="images" 
                                                                                    name="bullet1.gif"/></span>Destacados</div>

                        <div class="feat_prod_box">

                            <div class="prod_img"><h:graphicImage library="images" name="north-glens-Whisky.jpg"
                                                                  style="border: 0px"  width="180" height="180"/>
                            </div>

                            <div class="prod_det_box">
                                <div class="box_top"></div>
                                <div class="box_center">
                                    <div class="prod_title">North Glens Whisky</div>
                                    <p class="details">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation.</p>
                                    <a href="details.html" class="more">- mas detalles -</a>
                                    <div class="clear"></div>
                                </div>

                                <div class="box_bottom"></div>
                            </div>    
                            <div class="clear"></div>
                        </div>	


                        <div class="feat_prod_box">

                            <div class="prod_img"><h:graphicImage library="images" name="ret-icelandic-Orange-Vodka.jpg" style="border: 0px"  width="180" height="180"/></div>

                            <div class="prod_det_box">
                                <div class="box_top"></div>
                                <div class="box_center">
                                    <div class="prod_title">Icelandic Orange Vodka</div>
                                    <p class="details">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation.</p>
                                    <a href="details.html" class="more">- mas detalles -</a>
                                    <div class="clear"></div>
                                </div>

                                <div class="box_bottom"></div>
                            </div>    
                            <div class="clear"></div>
                        </div>      



                        <div class="title"><span class="title_icon"><h:graphicImage library="images" name="bullet2.gif" /></span>Nuevos productos</div> 

                        <div class="new_products">

                            <div class="new_prod_box">
                                Nombre
                                <div class="new_prod_bg">
                                    <span class="new_icon"><h:graphicImage library="images" name="new_icon.gif" /></span>
                                    <h:graphicImage library="images" name="cerol-rojo-Aperitivo de Cafe-min.jpg"
                                                    class="thumb"  style="border: 0px"  />
                                </div>           
                            </div>

                            <div class="new_prod_box">
                                <a href="details.html">Nombre</a>
                                <div class="new_prod_bg">
                                    <span class="new_icon"><h:graphicImage library="images" name="new_icon.gif" /></span>
                                    <a href="details.html"><img src="./resources/images/thumb2.gif" alt="" title="" class="thumb" border="0" /></a>
                                </div>           
                            </div>                    

                            <div class="new_prod_box">
                                <a href="details.html">Nombre</a>
                                <div class="new_prod_bg">
                                    <span class="new_icon"><h:graphicImage library="images" name="new_icon.gif" /></span>
                                    <a href="details.html"><img src="./resources/images/thumb3.gif" alt="" title="" class="thumb" border="0" /></a>
                                </div>           
                            </div>

                            <div class="new_prod_box">
                                <a href="details.html">Nombre</a>
                                <div class="new_prod_bg">
                                    <span class="new_icon"><h:graphicImage library="images" name="new_icon.gif" /></span>
                                    <a href="details.html"><img src="./resources/images/thumb2.gif" alt="" title="" class="thumb" border="0" /></a>
                                </div>           
                            </div>

                            <div class="new_prod_box">
                                <a href="details.html">Nombre</a>
                                <div class="new_prod_bg">
                                    <span class="new_icon"><h:graphicImage library="images" name="new_icon.gif" /></span>
                                    <a href="details.html"><img src="./resources/images/thumb3.gif" alt="" title="" class="thumb" border="0" /></a>
                                </div>           
                            </div>                    

                            <div class="new_prod_box">
                                <a href="details.html">Nombre</a>
                                <div class="new_prod_bg">
                                    <span class="new_icon"><h:graphicImage library="images" name="new_icon.gif" /></span>
                                    <a href="details.html"><img src="./resources/images/thumb1.gif" alt="" title="" class="thumb" border="0" /></a>
                                </div>           
                            </div>                    



                        </div> 


                        <div class="clear"></div>
                    </ui:insert>
                </div>
                <!--fin del contenido derecho-->



                <!--comienzo del contenido izquierdo-->
                <div class="right_content">
                    
                    


                    <div class="cart">
                        <div class="title"><span class="title_icon"><img src="./resources/images/cart.gif" alt="" title="" /></span>Llamenos Ya</div>
                        <div class="home_cart_content">
                            3204597432 | <span class="red">Catagena</span>
                        </div>
                        

                    </div>




                    <div class="title"><span class="title_icon"><img src="./resources/images/bullet3.gif" alt="" title="" /></span>Quienes somos</div> 
                    <div class="about">
                        <p>
                            
                            Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud.
                        </p>

                    </div>

                    <div class="right_box">

                        <div class="title"><span class="title_icon"><img src="./resources/images/bullet4.gif" alt="" title="" /></span>Promociones</div> 
                        <div class="new_prod_box">
                            <a href="details.html">Nombre</a>
                            <div class="new_prod_bg">
                                <span class="new_icon"><h:graphicImage library="images" name="promo_icon.gif"/></span>
                                <a href="details.html"><img src="./resources/images/thumb1.gif" alt="" title="" class="thumb" border="0" /></a>
                            </div>           
                        </div>

                        <div class="new_prod_box">
                            <a href="details.html">Nombre</a>
                            <div class="new_prod_bg">
                                <span class="new_icon"><h:graphicImage library="images" name="promo_icon.gif"/></span>
                                <a href="details.html"><img src="./resources/images/thumb2.gif" alt="" title="" class="thumb" border="0" /></a>
                            </div>           
                        </div>                    

                        <div class="new_prod_box">
                            <a href="details.html">Nombre</a>
                            <div class="new_prod_bg">
                                <span class="new_icon"><h:graphicImage library="images" name="promo_icon.gif"/></span>
                                <a href="details.html"><img src="./resources/images/thumb3.gif" alt="" title="" class="thumb" border="0" /></a>
                            </div>           
                        </div>              

                    </div>

                    <div class="right_box">
                        <!--
                           <div class="title"><span class="title_icon"><img src="images/bullet5.gif" alt="" title="" /></span>Categories</div> 
                           
                           <ul class="list">
                           <li><a href="#">accesories</a></li>
                           <li><a href="#">premium parts</a></li>
                           <li><a href="#">specials</a></li>
                           <li><a href="#">best deals</a></li>
                           <li><a href="#">accesories</a></li>
                           <li><a href="#">premium parts</a></li>
                           <li><a href="#">specials</a></li>
                           <li><a href="#">best deals</a></li>
                           <li><a href="#">accesories</a></li>
                           <li><a href="#">premium parts</a></li>
                           <li><a href="#">specials</a></li>                                              
                           </ul>
                           
                           <div class="title"><span class="title_icon"><img src="images/bullet6.gif" alt="" title="" /></span>Partners</div> 
                           
                           <ul class="list">
                           <li><a href="#">accesories</a></li>
                           <li><a href="#">premium parts</a></li>
                           <li><a href="#">specials</a></li>
                           <li><a href="#">best deals</a></li>
                           <li><a href="#">accesories</a></li>
                           <li><a href="#">premium parts</a></li>
                           <li><a href="#">specials</a></li>
                           <li><a href="#">best deals</a></li>
                           <li><a href="#">accesories</a></li>                              
                           </ul>  -->    

                    </div>         


                </div>






                <div class="clear"></div>
            </div>

            <!--fin del contenido izquierdo-->


            <div class="footer">
                
               


            </div>


        </div>








    </h:body>

</html>


